<template>
	<view class="bg-light">
		<!-- 顶部标题组件 -->
		<tabsTop tabName="合美供销云平台"></tabsTop>
		<scroll-view :scroll-top="scrollTop" scroll-y="true" class="scroll-Y" @scrolltoupper="upper"
			@scrolltolower="lower" @scroll="scroll">
			<!-- 搜索框 -->
			<view class="search">
				<mySearch class="searchClick" @click="searchClick()"></mySearch>
			</view>
			<!-- 轮播图 -->
			<view class="uni-margin-wrap">
				<swiper class="swiper" circular :indicator-dots="indicatorDots" :autoplay="autoplay"
					:interval="interval" :duration="duration" style="height: 400rpx;">
					<swiper-item v-for="(item,index) in lb_Src"
						@click="handleSwiper(item.Carousel_Chart_Path,item.Carousel_Chart_Name,item.ShopColumn_Id)"
						:key="index">
						<image :src="Domain_IMG+item.Picture_URL" alt="" style="width: 100%; height: 100%;">
					</swiper-item>
				</swiper>
			</view>
			<!-- 轮播图下侧模块导航 -->
			<view class="bg-white">
				<view class="mx-1 pt-2 flex justify-between flex-wrap">
					<view style="width: 20%;" class="flex flex-column align-center" v-for="(item,index) in dh_Icons"
						:key="index" @click="navClick(item.url,item.ShopColumn_Id,item.name)">
						<view class="" style="width:110rpx;height: 110rpx;">
							<image :src="Domain_IMG+item.src" alt="" class="img">
							</image>
						</view>
						<view class="flex justify-center align-center py-3 mb-2" style="font-size: 24rpx;">
							{{item.name}}
						</view>
					</view>
				</view>
			</view>
			<!-- 店长推荐 -->
			<view class="" v-for="(item,index) in columns" :key="index">
				<view class="h3 flex justify-between align-center px-2 bg-white"
					style="height: 100rpx;border-left: 10rpx solid green;">
					<!-- 导航紧挨着的标题 -->
					{{item.Column_Name}}
					<view class="" style="width: 60rpx;height: 78rpx;">
						<image :src="Domain_ICON+'/fire.png'" alt="" mode="aspectFit" class="img"></image>
					</view>
				</view>
				<view class="px-2 flex flex-wrap justify-between bg-white">
					<view class="mt-1" v-for="(item1,index1) in dztj.slice(0,4)" :key="index"
						@click="productClick(item1.Article_Name,item1.Article_SerialNumber,item1.Sales_Unit_Price_SerialNumber,item1.Store_SerialNumber)"
						style="width: 49% ;height: 350rpx; border:1px solid rgb(22,118,58);">
						<image :src="Domain_IMG+item1.Picture_URL" mode="aspectFit" class="img"></image>
					</view>
				</view>
			</view>
			<!-- 好物优选 -->
			<view class="">
				<view class="w-100 mt-1 mb-2" style="height: 200rpx;">
					<!-- 广告图龙江好物优选 -->
					<image :src="Domain_ICON+'/hwyx.webp'" class="img" alt=""></image>
				</view>
				<!-- 好物优选的商品 -->
				<view class="mb-3 px-2 flex" style="height: 250rpx;" v-for="(item,index) in goods" :key="index"
					@click="productClick(item.Article_Name,item.Article_SerialNumber,item.Sales_Unit_Price_SerialNumber,item.Store_SerialNumber)">
					<!-- 左侧商品图片 -->
					<view class="left"
						style="width:55%; height: 100%; background-color: #fff;border:1px solid rgb(22,118,58);">
						<image :src="Domain_IMG+item.Picture_URL" class="img" alt="" mode="aspectFit"></image>
					</view>
					<!-- 右侧商品信息 -->
					<view class="right ml-2 flex flex-column justify-between w-100">
						<view class="">
							<!-- 商品名 -->
							<view class="" style="font-size: 28rpx;">
								{{item.Article_Name}}
							</view>
							<!-- 商品提示 -->
							<!-- <text class="" style="font-size: 20rpx; color: #ccc;">{{item.remark}}</text> -->
						</view>
						<view class="flex justify-between">
							<!-- 商品价格 -->
							<view class="flex align-center align-center">
								<!-- <view style="width: 28rpx; height: 28rpx;">
									<image :src="Domain_ICON+'/price.png'" mode="" class="img"></image>
								</view> -->
								<money :money="item.specifications[0].Sales_Unit_Price"></money>
							</view>
							<!-- 购物车字体 -->
							<view style="width: 40rpx; height: 40rpx;z-index: 10;" @click.stop="shopCart(item)">
								<image :src="Domain_ICON+'/shopcart.png'" mode="" class="img" style=""></image>
							</view>
						</view>
					</view>
				</view>
			</view>

			<!-- 每日推荐 -->
			<view class="" style="background-color: white;">
				<view class="h3 flex justify-between align-center px-2"
					style="height: 81rpx;border-left: 10rpx solid green; background-color:#fff;border-radius: 12rpx;">
					<!-- 导航紧挨着的标题 -->
					{{mrtj}}
					<view class="" style="width: 60rpx;height: 100%;">
						<image :src="Domain_ICON+'/fire.png'" alt="" class="img"></image>
					</view>
				</view>
				<view class="px-2">
					<!-- 每日推荐tab选项卡 -->
					<!-- 顶部导航栏 -->
					<view class="horizonal-tab flex justify-between my-2 px-5">
						<view v-for="(item,index) in tabBars" :key="index">
							<view class="scroll-tab-item" :class="{'active': tabIndex==index}" @tap="toggleTab(index)">
								<view class="mb-2">{{item.name}}</view>
								<view class="scroll-tab-line"></view>
							</view>
						</view>
					</view>
					<!-- 内容区 -->
					<view>
						<!-- 滑块视图 -->
						<swiper :current="tabIndex" @change="tabChange" style="height: 910rpx;">
							<!-- current:当前所在滑块的index -->
							<swiper-item v-for="(content,index) in contentList" :key="index" class="con">
								<!-- 销量榜 -->
								<view v-if="index==0">
									<view class="mb-3 flex" style="height: 250rpx;"
										v-for="(item1,index1) in goods.slice(0,3)" :key="index1"
										@click="productClick(item1.Article_Name,item1.Article_SerialNumber,item1.Sales_Unit_Price_SerialNumber,item1.Store_SerialNumber)">
										<!-- 左侧商品图片 -->
										<view class="left"
											style="width:55%; height: 100%; background-color: #fff;border:1px solid rgb(22,118,58);">
											<image :src="Domain_IMG+item1.Picture_URL" mode="aspectFit" class="img"
												alt="">
											</image>
										</view>
										<!-- 右侧商品信息 -->
										<view class="right ml-2 flex flex-column justify-between w-100">
											<view class="">
												<!-- 商品名 -->
												<view class="font">
													{{item1.Article_Name}}
												</view>
												<!-- 商品提示 -->
												<text class="font-small" style="color: #ccc;">{{item1.remark}}</text>
											</view>
											<view class="flex justify-between">
												<!-- 商品价格 -->
												<money :money="item1.specifications[0].Sales_Unit_Price"></money>
												<!-- 购物车图片 -->
												<view style="width: 40rpx; height: 40rpx;"
													@click.stop="shopCart(item1)">
													<image :src="Domain_ICON+'/shopcart.png'" mode="" class="img"
														style="">
													</image>
												</view>
											</view>
										</view>
									</view>
									<!-- 查看全部 -->
									<view class="flex justify-center font-sm" style="" @click="searchAll(content)">查看全部
									</view>
								</view>
								<!-- 人气榜 -->
								<view v-if="index==1">
									<view class="mb-3 flex" style="height: 250rpx;"
										v-for="(item1,index1) in goods.slice(0,3)" :key="index1"
										@click="productClick(item1.Article_Name,item1.Article_SerialNumber,item1.Sales_Unit_Price_SerialNumber,item1.Store_SerialNumber)">
										<!-- 左侧商品图片 -->
										<view class="left"
											style="width:55%; height: 100%; background-color: #fff;border:1px solid rgb(22,118,58);">
											<image :src="Domain_IMG+item1.Picture_URL" mode="aspectFit" class="img"
												alt="">
											</image>
										</view>
										<!-- 右侧商品信息 -->
										<view class="right ml-2 flex flex-column justify-between w-100">
											<view class="">
												<!-- 商品名 -->
												<view class="font">
													{{item1.Article_Name}}
												</view>
												<!-- 商品提示 -->
												<text class="font-small" style="color: #ccc;">{{item1.remark}}</text>
											</view>
											<view class="flex justify-between">
												<!-- 商品价格 -->
												<money :money="item1.specifications[0].Sales_Unit_Price"></money>
												<!-- <view class="flex align-center align-center font-md">
												{{item1.specifications[0].Sales_Unit_Price}}
											</view> -->
												<!-- 购物车图片 -->
												<view style="width: 40rpx; height: 40rpx;"
													@click.stop="shopCart(item1)">
													<image :src="Domain_ICON+'/shopcart.png'" mode="" class="img"
														style="">
													</image>
												</view>
											</view>
										</view>
									</view>
									<!-- 查看全部 -->
									<view class="flex justify-center font-sm" style="" @click="searchAll(content)">查看全部
									</view>
								</view>
								<!-- 新品榜 -->
								<view v-if="index==2">
									<view class="mb-3 flex" style="height: 250rpx;"
										v-for="(item1,index1) in goods.slice(0,3)" :key="index1"
										@click="productClick(item1.Article_Name,item1.Article_SerialNumber,item1.Sales_Unit_Price_SerialNumber,item1.Store_SerialNumber)">
										<!-- 左侧商品图片 -->
										<view class="left"
											style="width:55%; height: 100%; background-color: #fff;border:1px solid rgb(22,118,58);">
											<image :src="Domain_IMG+item1.Picture_URL" mode="aspectFit" class="img"
												alt="">
											</image>
										</view>
										<!-- 右侧商品信息 -->
										<view class="right ml-2 flex flex-column justify-between w-100">
											<view class="">
												<!-- 商品名 -->
												<view class="font">
													{{item1.Article_Name}}
												</view>
												<!-- 商品提示 -->
												<text class="font-small" style="color: #ccc;">{{item1.remark}}</text>
											</view>
											<view class="flex justify-between">
												<!-- 商品价格 -->
												<money :money="item1.specifications[0].Sales_Unit_Price"></money>
												<!-- 购物车图片 -->
												<view style="width: 40rpx; height: 40rpx;" @click.top="shopCart(item1)">
													<image :src="Domain_ICON+'/shopcart.png'" mode="" class="img"
														style="">
													</image>
												</view>
											</view>
										</view>
									</view>
									<!-- 查看全部 -->
									<view class="flex justify-center font-sm" style="" @click="searchAll(content)">查看全部
									</view>
								</view>
							</swiper-item>
						</swiper>
					</view>
				</view>
			</view>
			<!-- 最下面广告 -->
			<view class="">
				<view class="w-100 mt-1 mb-2" style="height: 200rpx;">
					<!-- 广告图龙江好物优选 -->
					<image :src="Domain_ICON+'/dbgg.webp'" class="img" alt=""></image>
				</view>
			</view>
			<!-- 底部赞助信息 -->
			<botSponsor></botSponsor>
			<!-- 逛一逛+返回顶部按钮 -->
			<view class="position-fixed bkTop" v-if="gyg_bgTop">
				<!-- 逛一逛 -->
				<view class="top mb-3" @click="()=>{this.gyg=!this.gyg}">
					<image :src="Domain_ICON+'/gyg.png'" mode="" class="img"></image>
				</view>
				<!-- 返回顶部 -->
				<view class="bot flex justify-center align-center" @click="backTop()">
					<view class="" style="width: 50rpx;height: 50rpx;">
						<image :src="Domain_ICON+'/bkTop.png'" mode="" class="img"></image>
					</view>
				</view>
			</view>
			<!-- 底部tab栏组件 -->
			<tabsBottom :tabId="0"></tabsBottom>
		</scroll-view>
		<!-- 逛一逛弹窗 -->
		<popUp ref="popup" type="top" :show='gyg' @Close="()=>{this.gyg=!this.gyg}" title="商品橱窗" Height="80">
			<!-- 店铺热榜 -->
			<view class="px-2 bg-white" style="">
				<view class="title flex justify-between align-center py-2">
					<view class="left flex align-center">
						<view class="" style="width: 50rpx; height: 50rpx;">
							<image :src="Domain_ICON+'/coin.webp'" mode="" class="img"></image>
						</view>
						<view class="">
							店铺热榜
						</view>
					</view>
					<!-- <view class="right font-sm " style="color: #999;">
						查看更多
						<uni-icons type="right" size="15" color="#999"></uni-icons>
					</view> -->
				</view>
				<scroll-view class="scroll-view_H" scroll-x="true" scroll-left="0" show-scrollbar>
					<view class="sign_row flex flex-nowrap">
						<!-- 循环生成两个商品数据 -->
						<view class="bg-white mb-3 mr-3 rounded-lg overflow-hidden flex-shrink"
							v-for="(item,index) in goods.slice(0,5)" :key="index" style="width: 330rpx">
							<!-- 商品图片 -->
							<view class="w-100" style="height: 250rpx;"
								@click="productClick(item.Article_Name,item.Article_SerialNumber,item.Sales_Unit_Price_SerialNumber,item.Store_SerialNumber)">
								<image :src="Domain_IMG+item.Picture_URL" mode="aspectFit" :alt="item.name" class="img">
								</image>
							</view>
							<view class="px-2 font-sm">
								<!-- 商品名 -->
								<view class="product-name pt-2  text-ellipsis" v-if="item.remark">
									{{item.remark}}
								</view>
								<view class="flex justify-between py-3 mt-2">
									<!-- 商品价格 -->
									<money :money="item.specifications[0].Sales_Unit_Price"></money>
								</view>
							</view>
						</view>
						<!-- 商品最后面,查看更多 -->
						<!-- <view class="flex flex-column justify-center align-center font-sm flex-shrink"
							style="width: 330rpx;height:310rpx;background-color: #ccc;">
							<view class="rounded-circle flex flex-column justify-center align-center"
								style="width: 40rpx;height: 40rpx;background-color: #aaa;">
								<uni-icons type="right" size="12" color="#fff"></uni-icons>
							</view>
							<text class="mt-1" style="color: #aaa;">查看更多</text>
						</view> -->
					</view>
				</scroll-view>
			</view>
			<!-- 为你推荐 -->
			<view class="px-2 bg-white" style="">
				<view class="title flex justify-between align-center py-2">
					<view class="left flex align-center">
						<view class="" style="width: 50rpx; height: 50rpx;">
							<image :src="Domain_ICON+'/coin.webp'" mode="" class="img"></image>
						</view>
						<view class="">
							为你推荐
						</view>
					</view>
					<!-- <view class="right font-sm " style="color: #999;">
						查看更多
						<uni-icons type="right" size="15" color="#999"></uni-icons>
					</view> -->
				</view>
				<scroll-view class="scroll-view_H" scroll-x="true" scroll-left="0" show-scrollbar="true">
					<view class="sign_row flex flex-nowrap">
						<!-- 循环生成两个商品数据 -->
						<view class="bg-white mb-3 mr-3 rounded-lg overflow-hidden flex-shrink"
							v-for="(item,index) in goods.slice(3,6)" :key="index" style="width: 330rpx"
							@click="productClick(item.Article_Name,item.Article_SerialNumber,item.Sales_Unit_Price_SerialNumber,item.Store_SerialNumber)">
							<!-- 商品图片 -->
							<view class="w-100" style="height: 250rpx;">
								<image :src="Domain_IMG+item.Picture_URL" mode="aspectFit" :alt="item.name" class="img">
								</image>
							</view>
							<view class="px-2 font-sm">
								<!-- 商品名 -->
								<view class="product-name pt-2  text-ellipsis" v-if="item.remark">
									{{item.remark}}
								</view>
								<view class="flex justify-between py-3 mt-2">
									<!-- 商品价格 -->
									<money :money="item.specifications[0].Sales_Unit_Price"></money>
								</view>
							</view>
						</view>
						<!-- 商品最后面,查看更多 -->
						<!-- <view class="flex flex-column justify-center align-center font-sm flex-shrink"
							style="width: 330rpx;height:310rpx;background-color: #ccc;">
							<view class="rounded-circle flex flex-column justify-center align-center"
								style="width: 40rpx;height: 40rpx;background-color: #aaa;">
								<uni-icons type="right" size="12" color="#fff"></uni-icons>
							</view>
							<text class="mt-1" style="color: #aaa;">查看更多</text>
						</view> -->
					</view>
				</scroll-view>
			</view>
			<!-- 历史足迹 -->
			<view class="px-2 bg-white" style="">
				<view class="title flex justify-between align-center py-2">
					<view class="left flex align-center">
						<view class="" style="width: 50rpx; height: 50rpx;">
							<image :src="Domain_ICON+'/coin.webp'" mode="" class="img"></image>
						</view>
						<view class="">
							历史数据
						</view>
					</view>
					<!-- <view class="right font-sm " style="color: #999;">
						查看更多
						<uni-icons type="right" size="15" color="#999"></uni-icons>
					</view> -->
				</view>
				<scroll-view class="scroll-view_H" scroll-x="true" scroll-left="0" show-scrollbar="false"
					enhanced="true">
					<view class="sign_row flex flex-nowrap">
						<!-- 循环生成两个商品数据 -->
						<view class="bg-white mb-3 mr-3 rounded-lg overflow-hidden flex-shrink"
							v-for="(item,index) in goods.slice(4,7)" :key="index" style="width: 330rpx"
							@click="productClick(item.Article_Name,item.Article_SerialNumber,item.Sales_Unit_Price_SerialNumber,item.Store_SerialNumber)">
							<view class="w-100" style="height: 250rpx;">
								<image :src="Domain_IMG+item.Picture_URL" mode="aspectFit" :alt="item.name" class="img">
								</image>
							</view>
							<view class="px-2 font-sm">
								<!-- 商品名 -->
								<view class="product-name pt-2  text-ellipsis" v-if="item.remark">
									{{item.remark}}
								</view>
								<view class="flex justify-between py-3 mt-2">
									<!-- 商品价格 -->
									<money :money="item.specifications[0].Sales_Unit_Price"></money>
								</view>
							</view>
						</view>
						<!-- 商品最后面,查看更多 -->
						<!-- <view class="flex flex-column justify-center align-center font-sm flex-shrink"
							style="width: 330rpx;height:310rpx;background-color: #ccc;">
							<view class="rounded-circle flex flex-column justify-center align-center"
								style="width: 40rpx;height: 40rpx;background-color: #aaa;">
								<uni-icons type="right" size="12" color="#fff"></uni-icons>
							</view>
							<text class="mt-1" style="color: #aaa;">查看更多</text>
						</view> -->
					</view>
				</scroll-view>
			</view>
		</popUp>
		<!-- 购物车弹窗 -->
		<popUp type="top" :show='shopcart' @Close="()=>{shopcart=false}" Height="70">
			<view class="flex ml-3" style="width: 70%;">
				<view class="getValue" :data-Article_SerialNumber="good.Article_SerialNumber"
					:data-quantity="good.quantity" :data-Unit_Price="good.specifications[0].Unit_Price">
				</view>
				<!-- <view class="get_samevalue"
					:data-Sales_Unit_Price_Stock_SerialNumber="good.Sales_Unit_Price_Stock_SerialNumber">

				</view> -->
				<view class="py-3" style="width:270rpx;height: 270rpx;">
					<image :src="Domain_IMG+good.Picture_URL" mode="" class="img"></image>
				</view>
				<view class="ml-2 flex flex-column justify-end pb-4" style="width: 200rpx;">
					<money :money="good.specifications[0].Sales_Unit_Price"></money>
					<view class="font-sm" style="color: #ccc;">
						<text>剩余{{good.specifications[0].Stock_Remain}}件</text>
					</view>
				</view>		
			</view>
			<view class="flex justify-between mx-3 mt-3">
				<view class="font">购买数量</view>
				<view class="">
					<counter :num="good.quantity" :max="good.specifications[0].Stock_Remain" @Count="counterClick">
					</counter>
				</view>
			</view>
			<view class="shop-cart position-fixed flex justify-center font text-white "
				style=" bottom:20rpx; margin:0 auto">
				<button class="btn-left text-white" :disabled="loading" @click="addCart()">加入购物车</button>
				<button class="btn-right text-white" @click="buyNow()">立即购买</button>
			</view>
		</popUp>
		<!-- 优惠券领取弹窗 -->
		<!-- <view class="">
			弹窗遮罩层 
			<view v-if="!isShowCouponPopUp" class="popover-mask-layer"></view>
			优惠劵弹窗 //用hidden而不用wx:if原因是hidden条件不成立时候也会加载图片
			
			<view v-if="!isShowCouponPopUp" class="coupon-pop-up" @touchmove.native.stop="onPreventTouchMove"
				@animation.native.stop="animationData">
				<view class="body">
					<view class="top-images">
						 顶部gif背景图 //监听图片加载完后再开启弹窗-
						<image :src="topImages"></image>
					</view>
					<view class="mid-coupons">
						<view class="content">
							<scroll-view scroll-y="true">
								<view v-for="(item,index) in couponArr" :index="index" :key="index">
									<view class="row flex justify-center">
										<coupon :couponName="item.Coupon_Scheme_Name"
											:couponRule="item.Coupon_Scheme_Rule" :Min_Amount="item.Min_Amount"
											:Preferential="item.Preferential"></coupon>
									</view>
								</view>
							</scroll-view>
						</view>
						<view class="bottom-get-btn">
							<view :disabled="loading" @click="getAllCoupons">全部领取</view>
						</view>
					</view>
					<view class="bottom-close-btn">
						<view class="bottom-close-btn-child" @click="closeTheCouponPopUp">
							<image :src="closeBtnImages"></image>
						</view>
					</view>
				</view>
			</view>
		</view> -->
	</view>
</template>

<script>
	const app = getApp();
	import tabsTop from "@/components/tabs/tabs-top.vue";
	import tabsBottom from "@/components/tabs/tabs-bottom.vue";
	import mySearch from "@/components/mysearch/mysearch.vue";
	import botSponsor from "@/components/botsponsor/sponsor.vue"
	import popUp from "@/components/tabs/pop-up.vue"
	import money from "@/components/tool/money.vue"
	import counter from "@/components/tool/counter.vue"
	import coupon from "@/components/tool/coupon.vue"
	import {
		getWXCarouselChartAction,
		getWX2ColumnAction,
		getWXColumnMainAction,
		getWX2GoodsIdAction
	} from "@/api/index.js"
	import {
		getWXCheckShopCarAction,
		editWXEditShopCarQuantity,
		getWX2CheckStockAction
	} from "@/api/article.js"
	import {
		accMul
	} from "@/static/js/GeneralUtil.js"
	import {
		getAddAction
	} from "@/api/global.js"
	import {
		getqueryCollectTodayCouponAction,
		getreceiveCouponAction
	} from "@/api/coupon.js"
	import {
		NowTime
	} from "@/static/js/DateUtil.js"
	import {
		stringify
	} from "querystring";
	export default {
		components: {
			tabsTop, //顶部标题组件
			tabsBottom, //底部tab组件
			mySearch, // 搜索组件
			botSponsor, // 底部赞助商
			popUp,
			money,
			counter,
			coupon
		},
		data() {
			return {
				test: false,
				scrollTop: 0, // 页面位置
				old: {
					scrollTop: 0
				},
				Domain_IMG: app.globalData.Domain_IMG,
				Domain_ICON: app.globalData.Domain_ICON, //图标域名
				lb_Src: [], //轮播图图片路径
				indicatorDots: true, // 指示点
				autoplay: true, // 自动播放
				interval: 3000, //   幻灯片切换时长
				duration: 1000, //  自动播放时长 
				dh_Icons: [], // 轮播图下方页面导航,
				columns: [], // 栏目   
				dztj: [], // 店长推荐中的商品
				hwyx: [],
				goods: [], // 好物优选
				goodslen: '', // 每次获得到的商品长度
				good: {}, // 点击单个商品获取商品信息
				shopcart: false, // 购物车弹窗是否显示
				mrtj: "每日推荐",
				// 每日推荐选项卡
				scrollAreaLeft: 0,
				scrollAreaWidth: 0,
				tabItemList: [],
				scrollToLeft: 0,
				tabIndex: 0,
				/* 选中标签栏的序列,默认显示第一个 */
				contentList: [
					"销量榜",
					"人气榜",
					"新品榜",
				],
				tabBars: [{
						name: '销量榜',
						id: '0'
					},
					{
						name: '人气榜',
						id: '1'
					},
					{
						name: '新品榜',
						id: '2'
					}
				],
				xlb: [], // 销量榜
				rqb: [], // 人气榜
				xpb: [], //新品榜
				gyg_bgTop: true, // 逛一逛和返回顶部是否显示
				gyg: false, //  逛一逛弹窗是否显示
				storeList: [], //店铺热榜
				recommended: [], //为你推荐
				historuFoot: [], //历史足迹
				canshu: { // 每次查询需要带的参数
					App_ID: app.globalData.App_ID,
					Enterprise_Info_SerialNumber: app.globalData.Enterprise_Info_SerialNumber
				},
				flag: "true",
				num: 1200, // 到当前位置滚轮刷新
				page: 1, // 商品页数
				limit: 7, // 每次刷新的条数

				//  优惠券数据
				couponArr: [],
				topImages: 'http://m.qpic.cn/psc?/V14ZaBeY40XWC8/zkoezU7GGNbZGOF.DPhgQVgKh0Fw63ZhFQsd0hetQ8T6CBTPzbnz3dz1WfeDXiG6wY3NwfQcy1Y7Ry49HK1QdM9SKG1QzVXMBdXM0bH80fc!/b&bo=nQLyAJ0C8gADCSw!&rf=viewer_4',
				couponLeftImages: 'http://m.qpic.cn/psc?/V14ZaBeY40XWC8/zkoezU7GGNbZGOF.DPhgQXDCLspq1L1upRR.ZiRnZuFvq1XezxpUwmIc4ky9cr0DEpxn.YXOFA15Y03Wwkk2zJSBTVERFZsf3KTl5vSZorE!/b&bo=lgCWAJYAlgADCSw!&rf=viewer_4',
				closeBtnImages: 'http://m.qpic.cn/psc?/V14ZaBeY40XWC8/zkoezU7GGNbZGOF.DPhgQZjV2a5npNMM5D47K1jMLBHO3ccXXkEwsTHa*69Gi8pCGkdmz4imEISAR0fRbZj7*malDMMANN7ZzH8oI6XDWDk!/b&bo=QABAAEAAQAADCSw!&rf=viewer_4',
				// 是否显示优惠劵弹窗
				isShowCouponPopUp: false,
				loading: false, // 节流
			}
		},
		onLoad() {
			this.good.quantity = 1;
			this.getLb();
			this.getNav();
			this.getColumns();
			this.getHwyxGoods();
			this.getqueryCollectTodayCouponAction();
		},
		methods: {
			// 轮播图接口
			async getLb() {
				var res = await getWXCarouselChartAction(this.canshu);
				if (res.length > 0) {
					this.lb_Src = res
				}
			},
			// 紧挨着轮播图导航的接口
			async getNav() {
				var res = await getWX2ColumnAction(this.canshu);
				if (res.length > 0) {
					this.dh_Icons = res;
				}
			},
			// 栏目
			async getColumns() {
				var res = await getWXColumnMainAction(this.canshu);
				if (res.Status == 'success') {
					this.columns = res.Data;
				}
				if (res.Data[0].Column_Name == "店长推荐") {
					const dztjres = await this.getGoods(res.Data[0].Column_Id)
					this.dztj = dztjres.tableData;
				}
			},
			// 好物优选的商品查询
			async getHwyxGoods() {
				const res = await this.getGoods('C10000000000002');
				for (var i = 0; i < res.tableData.length; i++) {
					this.goods.push(res.tableData[i]);
				}
				this.goodslen = res.tableData.limit;
			},
			// 商品查询
			async getGoods(Id) {
				var canshu = {
					...this.canshu
				};
				// canshu.ShopColumn_Id = 'C10000000000002';
				canshu.ShopColumn_Id = Id;
				canshu.page = this.page;
				canshu.limit = this.limit;
				const res = await getWX2GoodsIdAction(canshu);
				if (res.Status = 'success') {
					return res;
				};
			},
			// 可领取优惠券查询
			async getqueryCollectTodayCouponAction() {
				var canshu = {
					...this.canshu
				};
				canshu.Open_ID = app.globalData.Open_ID;
				var res = await getqueryCollectTodayCouponAction(canshu);
				if (res.Status == 'success') {
					this.couponArr = res.Data;
					if (this.couponArr.length == 0) {
						this.isShowCouponPopUp = true;
					} else {
						this.isShowCouponPopUp = false;
					}
				}
			},
			// 领取优惠券接口
			async getreceiveCouponAction() {
				var canshu = {
					...this.canshu
				};
				canshu.Open_ID = app.globalData.Open_ID;
				canshu.Coupon_Scheme_SerialNumber = []
				for (var i = 0; i < this.couponArr.length; i++) {
					canshu.Coupon_Scheme_SerialNumber.push(this.couponArr[i].Coupon_Scheme_SerialNumber)
				}
				canshu.Coupon_Scheme_SerialNumber = JSON.stringify(canshu.Coupon_Scheme_SerialNumber)
				uni.showLoading({
					title: "加载中...",
				});
				this.loading = true;
				var res = await getreceiveCouponAction(canshu);
				this.isShowCouponPopUp = !this.isShowCouponPopUp;
				uni.hideLoading();
				this.loading = false;
			},
			// 加入购物车接口
			// async getGoods(page, limit) {
			// 	var canshu = {
			// 		...this.canshu
			// 	};
			// 	canshu.ShopColumn_Id = 'C10000000000002';
			// 	canshu.page = page;
			// 	canshu.limit = limit;
			// 	var res = await getWX2GoodsIdAction(canshu);
			// 	if (res.Status = 'success') {
			// 		for (var i = 0; i < res.tableData.length; i++) {
			// 			this.goods.push(res.tableData[i]);
			// 		}
			// 		this.goodslen = res.tableData.limit;
			// 	};

			// },
			shopCart(item) {
				this.loading = false;
				this.good = {
					...item
				}
				this.$set(this.good, "quantity", 1)
				// 传入需要拿到数据的选择器
				// this.getvalues('.getValue');
				this.shopcart = !this.shopcart;
			},
			upper(e) { // 滚动触顶
				console.log(1)
			},
			lower(e) { // 滚动触底
				console.log(2)
			},
			scroll(e) { // 滚动时就会触发
				if (e.detail.scrollTop > this.old.scrollTop) {
					this.gyg_bgTop = false;
				} else {
					this.gyg_bgTop = true;
				}
				this.old.scrollTop = e.detail.scrollTop;
				if (this.flag && e.detail.scrollTop > this.num) {
					this.num += 200;
					this.getHwyxGoods();
					this.page += 1;
					if (this.goodslen == this.goods.length) {
						this.flag = false;
					}
				}
			},
			counterClick(e) {
				this.good.quantity = e;
			},
			searchClick() {
				// 点击搜索进入搜索页
				uni.navigateTo({
					//搜索页路径
					url: "./search",
				});
			},
			// 点击轮播图跳转界面
			handleSwiper(url, Carousel_Chart_Name, ShopColumn_Id) {
				if (  Carousel_Chart_Name != "超值货柜"&&Carousel_Chart_Name != "乡村振兴") {
					uni.navigateTo({
						//搜索页路径
						url: url + "?ShopColumn_Id=" + ShopColumn_Id,
					});
				}
			},
			// 导航跳转
			navClick(url, ShopColumn_Id,Carousel_Chart_Name) {
				if (Carousel_Chart_Name != "冷调特区") {
					uni.navigateTo({
						url: url + '?ShopColumn_Id=' + ShopColumn_Id,
					})
				}
			},
			// 点击商品,进入商品详情页
			productClick(name, Article_SerialNumber, Sales_Unit_Price_SerialNumber,Store_SerialNumber) {
				uni.navigateTo({
					url: "/pages/index/productDetails?name=" + name + "&Article_SerialNumber=" +
						Article_SerialNumber + "&Sales_Unit_Price_SerialNumber=" + Sales_Unit_Price_SerialNumber + "&Store_SerialNumber="+Store_SerialNumber
				})
			},
			//切换选项卡
			toggleTab(index) {
				this.tabIndex = index;
			},
			// 查看全部
			searchAll(content) {
				uni.navigateTo({
					url: "/pages/index/productShowcase?content=" + content
				})
			},
			//滑动切换swiper
			tabChange(e) {
				this.tabIndex = e.detail.current;
			},
			backTop() {
				this.scrollTop = this.old.scrollTop
				this.$nextTick(function() {
					this.scrollTop = 0
				});
			},
			//阻止弹出层滑动事件，空函数，不做任何处理
			onPreventTouchMove: function() {
				return false;
			},
			//关闭优惠劵弹窗
			closeTheCouponPopUp: function() {
				// 设置优惠劵弹窗关闭动画
				var animation = uni.createAnimation({
					duration: 3000,
					timingFunction: 'ease',
				})
				this.animation = animation;
				animation.scale(0).step(3);
				this.animationData = animation.export(),

					//执行完动画后再关闭
					setTimeout(() => {
						this.isShowCouponPopUp = true
					}, 200)
			},
			//领取单个优惠劵
			getCoupons: function(e) {
				var index = e.currentTarget.dataset.index;
				var couponArr = this.couponArr;
				couponArr[index].HasItBeenClaimed = true;
				this.couponArr = couponArr
			},
			//已领取优惠劵
			alreadyReceived: function() {
				uni.showToast({
					title: '已领取，可在卡包查看',
					icon: 'none'
				})
			},
			// 获取表中数据
			getvalues(selector) {
				const query = uni.createSelectorQuery();
				var ele = query.selectAll(selector);

				ele.fields({
					dataset: true,
					computedStyle: true,
					context: true
				}, (e) => { //   拿到节点中想要的键值对信息
					console.log(e);
				}).exec()

			},
			// 购物车中立即购买
			buyNow() {
				if (this.good.quantity > 0) {

				} else {
					this.good.quantity = 1;
				}
				let Article = {
					Article_Name: this.good.Article_Name,
					Store_SerialNumber: this.good.Store_SerialNumber,
					Category_Name: "普通实物商品",
					Article_SerialNumber: this.good.Article_SerialNumber,
					Picture_URL: this.good.Picture_URL,
					Article_Specifications_SerialNumber: this.good.specifications[0]
						.Article_Specifications_SerialNumber,
					Sales_Unit_Price: this.good.specifications[0].Sales_Unit_Price,
					Sales_Unit_Price_Stock_SerialNumber: this.good.specifications[0]
						.Sales_Unit_Price_Stock_SerialNumber,
					Sign: this.good.specifications[0].Sign,
					Stock_Remain: this.good.specifications[0].Stock_Remain,
					Stock_Sell: this.good.specifications[0].Stock_Sell,
					Quantity: this.good.quantity,
					Unit_Price: this.good.specifications[0].Unit_Price
				}
				uni.navigateTo({
					url: "/pages/index/submitOrder?good=" + encodeURIComponent(JSON.stringify([Article]))
				})
			},
			//领取全部优惠劵
			getAllCoupons: function() {
				var res = this.getreceiveCouponAction();
				uni.showToast({
					title: '领取成功，已放入卡包',
					icon: 'none'
				})
			},
			// 判断购物车有无相同商品
			async getWXCheckShopCarAction(Sales_Unit_Price_Stock_SerialNumber) {
				var res = await getWXCheckShopCarAction({
					App_ID: app.globalData.App_ID,
					Open_ID: app.globalData.Open_ID,
					Sales_Unit_Price_Stock_SerialNumber,
				})
				return res;
			},
			// 加入购物车
			async addCart() {
				console.log(this.good.specifications[0].Sales_Unit_Price_Stock_SerialNumber,'要添加到购物的');
				this.loading = true;
				if (!this.good.quantity) {
					this.good.quantity = 1
				}
				var sales_order = {
					Sales_Order_SerialNumber: '',
					Store_SerialNumber: this.good.Store_SerialNumber,
					Sales_Address: '',
					Sales_Contacts: '',
					Sales_Phone: '',
					Sales_Message: '',
					Sales_Date: NowTime(),
					Open_ID: app.globalData.Open_ID,
					App_ID: app.globalData.App_ID,
					Sales_Amount: '',
					Collection_Amount: 0,
					Delivery_Amount: 0,
					Receive_Type: 0,
					Refund_Type: 0,
					Enterprise_Info_SerialNumber: app.globalData.Enterprise_Info_SerialNumber,
					Row_Status: 8,
					Children: {
						sales_order_detail: [{
							Sales_Order_Detail_SerialNumber: '',
							Sales_Order_SerialNumber: '',
							Sales_Unit_Price_Stock_SerialNumber: this.good.specifications[0].Sales_Unit_Price_Stock_SerialNumber,
							Article_SerialNumber: this.good.Article_SerialNumber,
							Article_Specifications_SerialNumber: this.good.specifications[0]
								.Article_Specifications_SerialNumber,
							Sign: this.good.specifications[0].Sign,
							Quantity: this.good.quantity,
							Unit_Price: this.good.specifications[0].Unit_Price,
							Sales_Unit_Price: this.good.specifications[0].Sales_Unit_Price,
							Amount: '',
							Row_Status: 8,
							Receive_Type: 0,
							Refund_Type: 0,
						}]
					}
				}
				console.log(sales_order);
				var res = await this.getWXCheckShopCarAction(this.good.specifications[0]
					.Sales_Unit_Price_Stock_SerialNumber);
				console.log("查询是否有相同商品");
				if (res.length == 0) {
					// 增加流程
					sales_order.Children.sales_order_detail[0].Amount = accMul(this.good.specifications[0]
						.Sales_Unit_Price, this.good.quantity)
					uni.showLoading({
						title: "加载中...",
					});
					var addres = await getAddAction({
						Data: JSON.stringify({
							sales_order: [sales_order]
						}),
						Open_ID: app.globalData.Open_ID
					})
					uni.hideLoading();
					if (addres.Status == "success") {
						uni.showToast({
							title: '提交成功！',
							icon: 'success'
						})
						const timer = setTimeout(() => {
							clearTimeout(timer)
							this.shopcart = false;
						}, 500)
					} else {
						uni.showToast({
							title: '提交失败！',
							icon: 'error'
						})
					}
				} else {
					uni.showLoading({
						title: "加载中...",
					});
					// 修改购物车商品数量
					var editres = await editWXEditShopCarQuantity({
						Open_ID: app.globalData.Open_ID,
						Article_SerialNumber: res[0].Article_SerialNumber,
						Quantity: this.good.quantity,
						Type: "1"
					})
					uni.hideLoading();
					if (editres.Status == "success") {
						uni.showToast({
							title: '提交成功！',
							icon: 'success'
						})
						const timer = setTimeout(() => {
							clearTimeout(timer)
							this.shopcart = false;
						}, 500)
					} else {
						uni.showToast({
							title: '提交失败！',
							icon: 'error'
						})
					}
				}
			}
		}
	}
</script>

<style lang="scss">
	.popover-mask-layer {
		height: 100vh;
		width: 100vw;
		background-color: rgba(0, 0, 0, 0.5);
		position: fixed;
		top: 0;
		z-index: 1002;
	}

	.coupon-pop-up {
		width: 100vw;
		height: 100vh;
		position: fixed;
		top: 0;
		z-index: 1003;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.coupon-pop-up .body {
		width: 650rpx;
	}

	.coupon-pop-up .top-images {
		width: 650rpx;
		height: 260rpx;
		position: relative;
	}

	.coupon-pop-up .top-images image {
		width: 100%;
		height: 100%;
		position: relative;
		z-index: 1004;
	}

	.coupon-pop-up .top-images .coupon-bg {
		position: absolute;
		height: 240rpx;
		width: 650rpx;
		z-index: 1003;
		bottom: 0;
	}

	.coupon-pop-up .mid-coupons {
		width: 650rpx;
		background-color: #E41B3F;
		border-radius: 0 0 30rpx 30rpx;
		padding: 20rpx;
		box-sizing: border-box;
		box-shadow: -5px 5px 10px -4px #222, 5px 5px 10px -4px #222;
	}

	.mid-coupons .content scroll-view {
		max-height: 510rpx;
		min-height: 340rpx;
		overflow-y: auto;
	}

	.coupon-pop-up .mid-coupons .row {
		height: 170rpx;
		padding: 20rpx 20rpx 0 20rpx;
		box-sizing: border-box;
		display: flex;
	}




	.mid-coupons {
		.bottom-get-btn {
			display: flex;
			justify-content: center;
			align-items: center;
			margin: 25rpx 0 20rpx 0;
		}
	}

	.mid-coupons {
		.bottom-get-btn view {
			width: 80%;
			height: 80rpx;
			border-radius: 80rpx;
			text-align: center;
			line-height: 80rpx;
			background-image: linear-gradient(to bottom, #FFF6D3, #DEB219);
			color: #B65023;
		}
	}

	.coupon-pop-up {
		.bottom-close-btn {
			height: 60rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			margin-top: 20rpx;
		}
	}

	.coupon-pop-up {
		.bottom-close-btn-child {
			width: 70rpx;
			height: 70rpx;
			display: flex;
			justify-content: center;
			align-items: center;
			background-color: rgba(255, 255, 255, 0.8);
			border-radius: 50%;
		}
	}

	.bottom-close-btn-child {
		image {
			width: 40rpx;
			height: 40rpx;
		}
	}

	.coupon-suspension-window {
		position: fixed;
		bottom: 300rpx;
		right: 20rpx;
		width: 70rpx;
		height: 70rpx;
	}

	.coupon-suspension-window image {
		width: 70rpx;
		height: 70rpx;
	}

	.shopping-cart-suspension-window {
		position: fixed;
		bottom: 200rpx;
		right: 20rpx;
		background-color: white;
		box-shadow: 0 0 10rpx #888;
		border-radius: 50%;
		width: 70rpx;
		height: 70rpx;
		display: flex;
		justify-content: center;
		align-items: center;
	}

	.shopping-cart-suspension-window image {
		width: 50rpx;
		height: 50rpx;
	}

	.scroll-Y {
		height: 100vh
	}

	.horizonal-tab {
		color: #ccc;
	}

	.horizonal-tab .active {
		color: #000;
		height: 100%;
	}


	.scroll-tab-item {
		height: 45rpx;
		line-height: 45rpx;
		display: inline-block;
		/* 必要，导航栏才能横向*/
		margin: 0rpx 30rpx 0 30rpx;
	}

	.active .scroll-tab-line {
		border-bottom: 5rpx solid #30c4cc;
		border-top: 5rpx solid #30c4cc;
		border-radius: 20rpx;
		width: 100%;
		margin: 0 auto;
		color: #000;
	}

	.info {
		padding: 20px;
	}

	.bkTop {
		bottom: 180rpx;
		right: 20rpx;

		.top,
		.bot {
			width: 100rpx;
			height: 100rpx;
			background-color: #fff;
			border-radius: 100rpx;
			overflow: hidden;
		}
	}

	.shop-cart {
		width: 100%;

		.btn-left {
			padding: 0;
			margin: 0;
			width: 45%;
			border-radius: 0;
			border-top-left-radius: 50rpx;
			border-bottom-left-radius: 50rpx;
			background-color: #383838;
		}

		.btn-right {
			padding: 0;
			margin: 0;
			width: 45%;
			border-radius: 0;
			border-top-right-radius: 50rpx;
			border-bottom-right-radius: 50rpx;
			background-color: #09BB07;
		}
	}
</style>